<template>
  <div>
    <component :is="currentComponent" :articleData="articleData"></component>
  </div>
</template>

<script>
import ArticlePanel from "../Article/ArticlePanel.vue";
import ArticleList from "../Article/ArticleList.vue";
export default {
  name: "Content",
  components: {
    ArticlePanel,
    ArticleList,
  },
  template: "",
  props: {},
  data() {
    return {
      articleData: {},
      currentComponent: {},
    };
  },
  computed: {},
  watch: {},
  created() {
    this.currentComponent = ArticleList;
    this.articleData = {};
    this.$bus.$on("articlePanelClick", (data) => {
      console.log("bus监听articlePanelClick事件");
      console.log(data);
      this.currentComponent = () => import("../Article/ArticlePage");
      this.articleData=data
    });
      this.$bus.$on("tohome", (data) => {
      console.log("bus监听articlePanelClick事件");
      console.log(data);
      this.currentComponent = ArticleList;
      this.articleData=data
    });
  },
  mounted() {},
  methods: {},
};
</script>

<style scoped lang="scss">
</style>
